<template>
  <div>
    <van-tabbar v-model="activeName">
      <van-tabbar-item
        v-for="(item, index) in list"
        :key="index"
        :icon="item.icon"
        @click="jump(item.url)"
        >{{ item.title }}</van-tabbar-item
      >
    </van-tabbar>
  </div>
</template>

<script>
export default {
  data() {
    return {
      //  active: '0',
      activeName: Number(sessionStorage.getItem("active")) || 0,
      list: [
        {
          title: "首 页",
          url: "/home",
          icon: "wap-home",
        },
        {
          title: "商 机",
          url: "/class",
          icon: "stop-circle",
        },
        {
          title: "商 城",
          url: "/good",
          icon: "point-gift",
        },
        {
          title: "消 息",
          url: "/broadcast",
          icon: "chat",
        },
        {
          title: "我 的",
          url: "/my",
          icon: "manager",
        },
      ],
    };
  },
  methods: {
    jump(url) {
      this.$router.push(url);
    },
  },
};
</script>

<style >
.van-tabbar--fixed {
  height: 0.55rem;
  z-index: 999;
}
/* 图标的区域 */
.van-tabbar-item__icon {
  font-size: 0.3rem;
  margin-bottom: 0.02rem;
}

/* 文字的区域 */
.van-tabbar-item__text {
  font-size: 0.22rem;
}
</style>
   